<template>
	<view class="add" v-if="flag">
		<form @submit="onSubmit">
			<div class="item">
				<input v-model="formValue.title" type="text" name="title" placeholder="请输入标题" />
			</div>
			<div class="item" v-show="false">
				<input v-model="formValue.author" type="text" name="author" placeholder="请输入作者" />
			</div>
			<div class="item">
				<textarea v-model="formValue.content" name="content" placeholder="请输入详细内容" />
			</div>
			<div class="item">
				<uni-file-picker v-model="imageValue" file-mediatype="image" mode="grid" @success="success" />
			</div>
			<view class="item">
				<button form-type="reset">重置</button>
				<button form-type="submit" type="primary" :disabled="formValue.content.length<5">发布</button>
			</view>
		</form>
	</view>
	<view v-else>
		<view>
			登录后才可以发表自己言论哦
		</view>
	</view>
</template>

<script>
	import {mapState} from 'vuex'
	export default {
		data() {
			return {
				flag:false,
				imageValue: [],
				formValue: {
					title: '',
					author: '',
					content: ''
				},
				icon: []
			}
		},
		computed: mapState(['hasLogin', 'uerInfo']),
		methods: {
			onshow(){
				let flag=true
				return true
			},
			// 上传成功
			success(e) {
				this.icon = e.tempFilePaths
				console.log(this.icon)
			},
			//点击提交
			onSubmit(e) {
				let detail = e.detail.value
				this.addData(detail)
				//图片提交
				console.log(detail)
			},
			addData(value) {
				uniCloud.callFunction({
					name: "addData",
					data: {
						detail: value,
						icon: this.icon,
						num:0
					}
				}).then(res => {
					uni.showToast({
						title: '发布成功'
					})
					setTimeout(() => {
						uni.navigateBack({
							delta: 1
						});
					}, 800)
				})
			}
		},
		
		onShow() {
			if(this.uerInfo.userName){
				this.formValue.author=this.uerInfo.userName
				this.flag=true
			}else{
				setTimeout(()=>{
					uni.navigateTo({
						url:'/pages/onlogin/onlogin'
					})
				},100)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.add {
		padding: 30rpx;

		.item {
			padding-bottom: 20rpx;

			input {
				border: 1px solid #eee;
				height: 80rpx;
				padding: 0 20rpx;
			}

			textarea {
				border: 1px solid #eee;
				width: 100%;
				padding: 0 20rpx;
				box-sizing: border-box;
			}

			button {
				margin-top: 10rpx;
			}
		}
	}
</style>